<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Echo by WebSocket</title>
</head>
<body>
	<h1>Echo Test</h1>
	<input id="sendTxt" type="text" />
	<button id="sendBtn">发送</button>
	<div id="recv"></div>
	<script
		src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.0.1/socket.io.js"></script>
	<script type="text/javascript">
		//创建socket
		var socket = io('http://localhost:3000?uuid=123');

		/* 
		 创建自定义事件 'news'
		 作用：接受服务端 socket.emit('news', 数据); 发出的数据
		 */
		socket.on('reply', function(data) {
			//输出服务端响应了数据
			console.log(data);
			document.getElementById('recv').innerHTML = document.getElementById('recv').innerHTML+data.payload;

		});

		document.getElementById('sendBtn').onclick = function() {
			var txt = document.getElementById('sendTxt').value;
			socket.emit('send', {
				"text" : txt
			});
		}

		
	</script>
</body>

</html>